import path from 'path';
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import AutoImport from 'unplugin-auto-import/vite';
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
import Components from 'unplugin-vue-components/vite';
import { createStyleImportPlugin } from 'vite-plugin-style-import';
import vueSetupExtend from 'vite-plugin-vue-setup-extend';
import { createHtmlPlugin } from 'vite-plugin-html';
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
import viteCompression from 'vite-plugin-compression';
import autoprefixer from 'autoprefixer';
import tailwindcss from 'tailwindcss';
import cesium from 'vite-plugin-cesium';
import ElementPlus from 'unplugin-element-plus/vite';
const { resolve } = path;
export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    cesium(),
    ElementPlus({
      useSource: true
    }),
    createSvgIconsPlugin({
      iconDirs: [path.resolve(process.cwd(), 'src/assets/svg/')],
      symbolId: '[name]'
    }),

    vueSetupExtend(),
    createStyleImportPlugin({ resolves: [] }),
    AutoImport({
      dirs: [''],
      dts: 'src/types/auto-import.d.ts',
      resolvers: [ElementPlusResolver()]
    }),
    Components({
      deep: false,
      dirs: [''],
      dts: 'src/types/components.d.ts',
      include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
      resolvers: [ElementPlusResolver({ importStyle: 'sass' })]
    }),
    viteCompression({
      verbose: true, // 默认即可
      disable: false, //开启压缩(不禁用)，默认即可
      deleteOriginFile: false, //删除源文件
      threshold: 10240, //压缩前最小文件大小
      algorithm: 'gzip', //压缩算法
      ext: '.gz' //文件类型
    }),
    createHtmlPlugin({
      minify: true,
      inject: {
        data: {
          buildTime: new Date().toLocaleString(),
          version: process.env.npm_package_version,
          appName: process.env.npm_package_name
        }
      }
    })
  ],
  resolve: {
    alias: [
      { find: '~/', replacement: resolve(__dirname, '../src/') },
      { find: '@', replacement: resolve(__dirname, '../src') },
      {
        find: 'vue',
        replacement: 'vue/dist/vue.esm-bundler.js' // compile template
      }
    ],
    extensions: ['.ts', '.js', '.jsx', '.tsx']
  },
  define: {
    'process.env': {}
  },
  css: {
    devSourcemap: true,
    postcss: {
      plugins: [autoprefixer(), tailwindcss()]
    },
    preprocessorOptions: {
      scss: {
        additionalData: `@use"./src/assets/styles/element/index.scss";`
      },
      less: {
        modifyVars: {
          hack: `true; @import (reference) "${resolve('./src/assets/css/breakpoint.less')}";`
        },
        javascriptEnabled: true
      }
    }
  }
});
